import { PureComponent } from "react"
import store from "../../../store"
import { changeAgeAction } from "../../../store/actionCreators"
import { connect } from "react-redux"

class Com1 extends PureComponent {
  // constructor() {
  //     super();
  //     this.state = {
  //         age: store.getState().age,
  //     }
  // }
  // componentDidMount() {
  //     store.subscribe(()=>{
  //         this.setState({ // 强制触发视图更新
  //             age: store.getState().age,
  //         })
  //     })
  // }
  onAdd(n) {
    store.dispatch(changeAgeAction(n))
  }

  render() {
    const { age } = this.props
    return (
      <div>
        <div>Com1:{age}</div>
        <div>
          <button
            onClick={() => {
              this.onAdd(1)
            }}
          >
            +1
          </button>
          <button
            onClick={() => {
              this.onAdd(2)
            }}
          >
            +2
          </button>
        </div>
      </div>
    )
  }
}

const fn = (state) => {
  return {
    age: state.age
  }
}

export default connect(fn)(Com1)
